import {
  createStore
} from 'vuex'
import axios from 'axios'
import persist from 'vuex-persistedstate'
export default createStore({
  state: {
    colorList: [],
    sizeList: [],
    objList: [], // 表格渲染的数据
  },
  mutations: {
    pushColor(state, val) {
      let flag = state.colorList.findIndex(item => item == val)
      if (flag != -1) {
        //  再点一次取消下面的
        console.log(state.colorList[flag]);
        state.colorList.splice(flag, 1)
      } else {
        state.colorList.push(val)
      }

      if (state.sizeList.length) { // 如果 尺寸有数据 把他的每一项拿出来 和当前点击 放入数组 
        state.sizeList.forEach(items => {
          state.objList = state.objList.filter(item => item.val && item.name);
          state.objList.push({
            val: val,
            name: items,
          })
        })
        console.log(state.objList);
      } else {
        state.objList.push({
          val: val,
          name: '',
        })
      }







    },
    sizeList(state, val) {
      let flag = state.sizeList.findIndex(item => item == val)
      if (flag != -1) {
        state.sizeList.splice(flag, 1)
      } else {
        state.sizeList.push(val)
      }


      if (state.colorList.length) { // 如果 颜色 有数据 把他的每一项拿出来 和当前点击 放入数组 
        state.objList = state.objList.filter(item => item.val && item.name);
        state.colorList.forEach(items => {
          state.objList.push({
            val: items,
            name: val,
          })
        })
      } else {
        state.objList.push({
          val: '',
          name: val,
        })
      }


    },

    // 重置
    remove(state, value) {
      state.colorList = []
      state.sizeList = []
      state.objList = []
    }
  },


  actions: {


  },
  // plugins: [persist()]


})